<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>在线设计</title>
    <link href="css/iconfont.css" rel="stylesheet">
    
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <!-- 头部底部样式 -->  
    <link href="css/header_public.css" rel="stylesheet"> 
    <link href="css/footer.css" rel="stylesheet">
    <!-- 悬浮层样式 -->
    <link rel="stylesheet" type="text/css" href="css/xuanfuceng.css" />
    <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.min.js"></script>
    <script src="js/common_v3.js.下载"></script>
    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
    <!--封装好的视频布局样式-->
    <link rel="stylesheet" href="css/jsmodern.min.css">
    <!--mp4视频插件-->
    <script src="js/jsmodern.min.js"></script>
</head>
<body>
<!-- 头部 -->
    <div class="header">
        <div class="h-logo">
            <a href="">
                <img src="images/logo.png" >
            </a>
            <!-- <a href="" rel="">
                <span>人人都是设计师</span>
            </a>
            <div class="h-logo-hover">
                拖我到书签栏 收藏设计坞
            </div>
            <img class="h-logo-img" src="images/collect_line.png"> -->
        </div>
        <div class="h-navs">
            <div class="h-nav-btn">
                <a rel="nofollow" href="">模板中心</a>
                <div class="h-nav-temp">
                    <div class="h-nav-temp-cont">
                        <div class="h-nav-temp-top">
                            <span>每日更新<span class="sj-blue">1000+</span> 开通VIP可享受海量</span>
                            <a class="sj-btn" href="" target="_blank">开通个人VIP</a>
                        </div>
                        <ul class="h-nav-temp-temps">                                                                                             
                            <li>
                                <span class="temp-hot1 icon-media">
                                    <a rel="nofollow" href="">手机海报</a>
                                </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">节日节气</a></li>
                                    <li><a href="">宣传促销</a></li>
                                    <li><a href="">招聘纳新</a></li>
                                    <li><a href="">日签月签</a></li>
                                    <li><a href="">企业文化</a></li>
                                   <li><a href="">更多&gt;&gt;</a></li>
                                </ul>
                            </li>
                            <li>
                            <span class="temp-hot2 icon-paper">
                                <a href="">广告印刷</a>
                            </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">印刷海报</a></li>
                                    <li><a href="">宣传单</a></li>
                                    <li><a href="">名片</a></li>
                                    <li><a href="">竖版名片</a></li>
                                    <li><a href="">工作证</a></li>
                                    <li><a href="">更多&gt;&gt;</a></li> 
                                </ul>
                            </li>
                            <li>
                                <span class=" icon-ds">
                                    <a href=""> 新媒体配图</a>   
                                </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">公众号首图</a></li>
                                    <li><a href="">公众号次图</a></li>
                                    <li><a href="">朋友圈封面</a></li>
                                    <li><a href="">二维码</a></li>
                                    <li><a href="">课程封面</a></li>
                                    <li><a href="">更多&gt;&gt;</a></li> 
                                </ul>
                            </li>
                             <li>
                                <span class=" icon-print">
                                    <a href="">电商淘宝</a>
                                </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">淘宝banner</a></li>
                                    <li><a href="">直通车</a></li>
                                    <li><a href="">主图图标</a></li>
                                    <li><a href="">详情页</a></li>
                                    <li><a href="">首页</a></li>
                                    <li><a href="">更多&gt;&gt;</a></li> 
                                </ul>
                            </li>
                            <li>
                                <span class="temp-new icon-gif">
                                    <a href=""> GIF海报</a>
                                </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">节日节气</a></li>
                                    <li><a href="">日签月签</a></li>
                                    <li><a href="">餐饮美食</a></li>
                                    <li><a href="">宣传促销</a></li>
                                    <li><a href="">招聘纳新</a></li>
                                    <li><a href="">更多&gt;&gt;</a></li> 
                                </ul>
                            </li>
                            <li>
                                <span class=" ">
                                    <a href="">视频</a>
                                </span>
                                <ul class="h-nav-temp-subtemps">
                                    <li><a href="">节日祝福</a></li>
                                    <li><a href="">商品促销</a></li>
                                    <li><a href="">情感相册</a></li>
                                    <li><a href="">企业宣传</a></li>
                                    <li><a href="">党政机关</a></li>
                                    <li><a href="">更多&gt;&gt;</a></li> 
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="h-nav-btn" data-type="2">
                <a href="">热门分类</a>
                <div class="h-nav-temp h-nav-temp-down">
                    <ul>
                        <li><a href="">手机海报</a></li>
                        <li><a href="">GIF海报</a></li>
                        <li><a href="">电商淘宝</a></li>
                        <li><a href="">视频</a></li>
                        <li><a target="">裁剪神器</a></li>
                    </ul>
                </div>
            </div>
            <div class="h-nav-btn" data-type="1">
                <a href="">手机海报</a>
            </div>
            <div class="h-nav-btn" data-type="1">
                <a href="">GIF海报</a>
            </div>
            <div class="h-nav-btn" data-type="1">
                <a href="">视频</a>
                <span class="h-nav-icon h-nav-icon-new"></span>
            </div>
            <div class="h-nav-btn" data-type="1">
                <a href="">设计神器</a>
                <div class="h-nav-temp h-nav-temp-down">
                    <ul>
                        <li><a href="">裁剪神器</a></li>
                        <li><a href="">抠图神器</a></li>
                    </ul>
                </div>
            </div>
            <div class="h-nav-division"><span></span></div>
            <div class="h-nav-btn">
                <a href="">个人VIP</a>
                <span class="h-nav-icon"></span>
                <div class="h-nav-temp h-nav-temp-vip">
                    <ul class="h-nav-vip-auth">
                        <li class="h-nav-vip-title">
                            开通VIP即可获得
                        </li>
                        <li class="h-nav-vip-subtitle">
                            <span class="h-nav-line-left"></span>云端编辑海量下载 每天低至0.1元/天
                            <span class="h-nav-line-right"></span>
                        </li>
                        <li class="h-nav-vip-items">
                            <div>
                                <a href="">
                                    <img src="images/download.png" alt="">
                                    <span>高速下载</span>
                                </a>
                            </div>
                            <div>
                                <a href="">
                                    <img src="images/storage.png" alt="">
                                    <span>10G云端存储</span>
                                </a>
                            </div>
                            <div>
                                <a href="">
                                    <img src="images/hd.png" alt="">
                                    <span>无水印下载</span>
                                </a>
                            </div>
                            <div>
                                <a href="">
                                    <img src="images/collect.png" alt="">
                                    <span>海量收藏</span>
                                </a>
                            </div>
                        </li>
                        <li class="h-nav-vip-charge">
                            <a href="" class="h-nav-vip-btn">
                                <span class="h-nav-vip-icon"></span>
                                <span>开通个人VIP</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="h-nav-btn">
                <a href="">企业VIP</a>
                <span class="h-nav-icon"></span>
                <div class="h-nav-temp h-nav-temp-vip">
                    <div class="h-nav-temp-evip">
                        <p><span>设计坞</span> <span>企业VIP</span></p>
                        <div class="h-nav-temp-ebody">
                            <a href="">
                                <div class="h-nav-temp-etext">
                                    <p>企业VIP商用授权</p>
                                    <p>给公司用 让老板付钱</p>
                                </div>
                            </a>
                            <div class="h-nav-temp-eleft"></div>
                            <div class="h-nav-temp-eright"></div>
                        </div>
                        <div class="h-nav-temp-efoot">
                            <a href="" class="h-nav-temp-ebtn">立即开通</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="h-nav-btn">
                <a class="h-nav-btn-more"><span class="iconfont icon-diandiandian"></span></a>
                <div class="h-nav-temp h-nav-temp-down">
                    <ul>
                        <li><a href="">精品专题</a></li>
                        <li><a href="">设计师招聘</a></li>
                        <li><a href="">设计定制</a></li>
                        <li><a href="">软件教程</a></li>
                        <li><a href="">邀请活动</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="h-search">
            <input type="text" name="q" value=""  placeholder="100000+精选设计素材供你挑选" class="searchInput">
            <span class="iconfont icon-sousuo actionSearch"></span>
            <a href="" class="h-search-cancel "><span class="iconfont icon-guanbi2"></span></a>
            <div class="h-search-wrap">
                <div>
                    <div class="h-search-recent">
                        <span id="searchHistory">最近搜索: </span>
                    </div>
                    <ul class="h-search-items">
                        <li class="h-search-item h-search-hl ">
                            <a href="">
                                <span>五一劳动节</span>
                            </a>
                        </li>
                        <li class="h-search-item h-search-hl ">
                            <a href="">
                                <span>招聘</span>
                            </a>
                        </li>
                        <li class="h-search-item h-search-hl ">
                            <a href="">
                                <span>抗击疫情</span>
                            </a>
                        </li>
                        <li class="h-search-item  ">
                            <a href="">
                                <span>早安</span>
                            </a>
                        </li>
                        <li class="h-search-item  ">
                            <a href="">
                                <span>开业</span>
                            </a>
                        </li>
                        <li class="h-search-item  ">
                            <a href="">
                                <span>招生</span>
                            </a>
                        </li>
                        <li class="h-search-item  ">
                            <a href="">
                                <span>五四青年节</span>
                            </a>
                        </li>
                        <li class="h-search-item  ">
                           <a href="">
                                <span>春季促销</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="h-search-cata">
                <span>
                    <span class="select-show">全部</span>
                    <span class="iconfont icon-xiangxia"></span>
                </span>
                <ul class="h-search-cata-hover">
                    <li><a href="">全部</a></li>
                    <li><a href="">图片</a></li>
                    <li><a href="">动图</a></li>
                    <li><a href="">视频</a></li>
                </ul>
            </div>
        </div>
        <div class="h-info">
            <a class="h-login" href="">登录/注册</a>
        </div>
    </div>
    <!-- /头部 -->
    <div style="margin-top: 70px;">
        <div class="content">
            <div class="w1200" id="crumbs"></div>
            <div class="row" id="class-box">
                <!-- 主分类 -->
                <div id="class-box-list2" class="w1200">
                    <span class="title-name">分类：</span>
                    <div class="small-box">
                        <div class="navig-list2 clearfix list-berno">
                            <ul class="fl navig-lists" style="height: 40px;">
                                <li><a href="">全部</a></li>
                                <li class="choose"><a href="">手机海报</a></li>
                                <li><a href="">广告印刷</a></li>
                                <li><a href="">新媒体配图 </a></li>
                                <li><a href="">电商淘宝</a></li>
                                <li><a href="">小报</a></li>
                                <li><a href="">LOGO</a></li>
                                <li><a href="">效果图</a></li>
                                <li><a href="">GIF海报</a></li>
                                <li><a href="">GIF表情包</a></li>
                                <li><a href="">GIF横图</a></li>
                                <li><a href="">GIF二维码</a></li>
                                <li><a href="">GIF视频</a></li>
                            </ul>
                        </div>
                    </div>
                    <span class="more-btn" style="display: inline;">
                        <span class="more-text">更多</span>
                        <span class="iconfont icon-down-fill more-icon"></span>
                    </span>
                </div> 
                <!-- /主分类 -->
                <!-- 次分类 -->
                <div id="class-box-list2" class="w1200">
                    <span class="title-name">用途：</span>
                    <div class="small-box">
                        <div class="navig-list2 clearfix list-berno">
                            <ul class="fl navig-lists" style="height: 40px;">
                                <li class="choose"><a href="">全部</a></li>
                                <li><a href="">节日节气</a></li>
                                <li><a href="">促销宣传</a></li>
                                <li><a href="">招聘纳新 </a></li>
                                <li><a href="">日签月签</a></li>
                                <li><a href="">企业文化</a></li>
                                <li><a href="">邀请函</a></li>
                                <li><a href="">活动会展</a></li>
                                <li><a href="">直播培训</a></li>
                                <li><a href="">招商加盟</a></li>
                                <li><a href="">手机壁纸</a></li>
                                <li><a href="">启动页</a></li>
                                <li><a href="">漫画海报</a></li>
                                <li><a href="">其他</a></li>
                            </ul>
                        </div>
                    </div>
                    <span class="more-btn" style="display: inline;">
                        <span class="more-text">更多</span>
                        <span class="iconfont icon-down-fill more-icon"></span>
                    </span>
                </div> 
                <!-- /次分类 -->
                <!-- 次分类 -->
                <div id="class-box-list2" class="w1200">
                    <span class="title-name">行业：</span>
                    <div class="small-box">
                        <div class="navig-list2 clearfix list-berno">
                            <ul class="fl navig-lists" style="height: 40px;">
                                <li class="choose"><a href="">全部</a></li>
                                <li><a href="">通用</a></li>
                                <li><a href="">餐饮美食</a></li>
                                <li><a href="">教育培训 </a></li>
                                <li><a href="">金融科技</a></li>
                                <li><a href="">运动健身</a></li>
                                <li><a href="">房地产</a></li>
                                <li><a href="">文化娱乐</a></li>
                                <li><a href="">旅游出行</a></li>
                                <li><a href="">服饰美妆</a></li>
                                <li><a href="">汽车交通</a></li>
                                <li><a href="">公益环保</a></li>
                                <li><a href="">医疗健康</a></li>
                            </ul>
                        </div>
                    </div>
                    <span class="more-btn" style="display: inline;">
                        <span class="more-text">更多</span>
                        <span class="iconfont icon-down-fill more-icon"></span>
                    </span>
                </div> 
                <!-- /次分类 -->
            </div>
        </div>
    </div>
    <!-- 筛选排序 -->
    <div class="w1200 nav-sort-box clearfix bgw">
        <ul class="nav-sort clearfix" id="myTab">
            <li class="nav-sprtno">
                <a href="">综合排序</a>
            </li>
            <li>
                <a href="" data-toggle="tab">热门下载</a>
            </li>
            <li>
                <a href="" data-toggle="tab">最新上传</a>
            </li>
        </ul>
        <div class="nav-plate">
            <span class="banshi">全部版式<span class="iconfont icon-down-fill more-icon" style="font-size: 12px;"></span></span>
            <ul class="nav-plate-item">
                <li>
                    <a class="active" href="">全部版式</a>
                </li>
                <li>
                    <a href="">横版</a>
                </li>
                <li>
                    <a href="">竖版</a>
                </li>
                <li>
                    <a href="">长版</a>
                </li>
            </ul>
        </div>  
    </div>
    <!-- 瀑布流 -->
    <div id="fh5co-main" class="cat-section section-padding-2 shouji">
        <div class="w1200">
            <div class="row">
                <div id="fh5co-board" data-columns>
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-24.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div>  
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                    <div class="item pb-tupian mb-20">
                        <div class="single-cat-item tubiao" style="padding: 10px 10px 15px;">
                            <div class="animate-box">
                                <div  style="position: relative;">
                                    <img src="images/img-25.png" alt="" style="border-radius: 10px;">
                                    <img class="bofang" src="images/bofang.png">
                                </div>
                                <div class="item-meta">
                                    <a href="" class="watch-list-btn"><span class="iconfont icon-edit"></span>开始设计</a>
                                </div>
                            </div>
                            <h4 class="fh5co-desc text-center mt-10" style="color: #666;font-weight: bold;">九月你好</h4>
                        </div>
                    </div> 
                </div>
            </div>
       </div>
    </div>
    <!-- /瀑布流 -->
    <!-- 分页 -->
    <div class="paging w1200" style="margin-top: 50px;">
        <ul class="clearfix">
            <style>/*分页*/.paging{ text-align:center; margin-bottom:30px; }
            .paging ul{ display:inline-block; max-width: none}
            .paging ul .toppage-on{ background:#1fbede; border-radius:4px; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fd997b', endColorstr='#f25b4a', GradientType=1); }
            .paging ul li{ float:left; height:50px; width: 50px; background:#FFFFFF; text-align:center; line-height:50px; box-sizing:border-box; border:1px solid #EEEEEE; margin:0 5px; font-size:14px; color:#666666; border-radius:4px; }
            .paging ul .toppage-on a{ color:#FFFFFF; }
            .paging ul li a{ display:block; width:100%; height:100%; }
            .paging .toppage, .paging .botpage {width: 80px;height: 50px;}
            .paging .pagination li a:hover{background: #1fbede;border-radius: 4px;color: #fff;}
            </style>
            <ul class="pagination">
                <li style="background: #F9F9F9;" class="toppage">
                    <button style="outline:none;background:#F9F9F9;color:#999;border:0;" data-page="">上一页</button>
                </li>
                <li class="toppage-on"><a >1</a></li>
                <li><a href="">2</a></li>
                <li><a href="">3</a></li>
                <li><a href="">4</a></li>
                <li data-page="3">  . . .  </li>
                <li><a href="">250</a></li>
                <li class="toppage"><a href="">下一页</a></li>
            </ul>               
        </ul>
    </div>
    <!--/ 分页 -->
    <!--Footer Area-->
    <div class="footer" _h="1346" _o="1358" style="margin-top: 50px;">
        <div class="footer-content">
            <div class="w1200">
                <div class="footet-jiesao clearfix">
                    <div class="fl footer-logo-box">
                        <img src="images/logo-left-foot.png" style="width: auto;height: 75px;" class="footer-logo">
                        <div class="partner-box">
                            <p style="margin-bottom: 10px;font-size: 14px;color: #999;">公司电话公司电话：010-8556203</p>
                            <p style="margin-bottom: 10px;font-size: 14px;color: #999;">负责人电话：15186007530</p>
                            <p style="margin-bottom: 10px;font-size: 14px;color: #999;">快设计 - 3分钟在线高效完成平面设计</p>
                        </div>
                    </div>
                    <div class="fr footer-kefu">
                        <div class="all-client" pv-click="1388" _c="1388">
                            <a href="https://818ps.com/pc?origin=footer" target="_blank"></a>
                            <i class="iconfont icon-diannao"></i>
                            pc客户端
                        </div>
                        <div class="all-client" pv-click="1389" _c="1389">
                            <a href="https://818ps.com/app/" target="_blank"></a>
                            <i class="iconfont icon-shouji"></i>
                            手机APP
                        </div>
                        <div class="all-client" pv-hover="1390" _h="1390" pv-hover-out="1913" _o="1913">
                            <div class="img-box">
                                <img src="images/xcx-code.jpg" alt="">
                                微信扫一扫
                            </div>
                            <i class="iconfont icon-xiaochengxu"></i>
                            微信小程序
                        </div>
                        <div class="all-client" pv-hover="1391" _h="1391" _o="1929" pv-hover-out="1929">
                            <div class="img-box">
                                <img src="images/vx-code.jpg" alt="">
                                微信扫一扫
                            </div>
                            <i class="iconfont icon-weixin1"></i>
                            微信公众号
                        </div>
                        <div class="qq-kefu">
                            <p>24小时客服</p>
                            <p style="font-size: 25px;margin-bottom: 15px;">400-583-650</p>
                            <a class="lxkf" _c="1111">立即咨询</a>
                        </div>
                    </div>
                </div>
            </div>
                                <ul class="friendship w1200">
                    <div class="friend-link">
                        <div class="friend-link-btn">
                            <a href="javascript:void(0)" class="tab" data-id="1">友情链接</a>
                            <a href="javascript:void(0)" class="tab" data-id="2">热门搜索</a>
                            <a href="javascript:void(0)" class="tab" data-id="3">热门海报设计</a>
                            <a href="javascript:void(0)" class="tab" data-id="4">图片设计模板</a>
                        </div>
                        <div class="friend-link-right">
                            <div class="bottom_seo_link bottom_seo_link_1">
                                <a href="">素材图</a>
                                <a href="">千图网</a>
                                <a href="">包图网</a>
                                <a href="">4K壁纸</a>
                                <a href="">摄图网</a>
                                <a href="">字体下载</a>
                                <a href="">壁纸</a>
                                <a href="">雨林木风</a>
                                <a href="">在线ps</a>
                                <a href="">飞特网</a>
                                <a href="">ppt模板</a>
                                <a href="">海报设计</a>
                                <a href="">AE模板</a>
                                <a href="">96微信编辑器</a>
                                <a href="">PS教程网</a>
                                <a href="">PS</a>
                                <a href="">爱给网免费素材</a>
                                <a href="">元素图片</a>
                                <a href="">背景图片</a>
                                <a href="">视频素材</a>
                                <a href="">优秀网站</a>
                                <a href="">虎课网</a>
                                <a href="">CG</a>
                                <a href="">平面设计素材</a>
                                <a href="">视达网</a>
                                <a href="">3d模型下载</a>
                                <a href="">文档模板下载</a>
                                <a href="">ps教程自学网</a>
                                <a href="">猴子音乐</a>
                                <a href="">分类目录</a>
                                <a href="">六图网</a>
                                <a href="">淘宝开店</a>
                                <a href="">ppt模板</a>
                                <a href="">一键重装系统</a>
                                <a href="">订花</a>
                                <a href="">满分作文网</a>
                                <a href="">魔法网</a>
                                <a href="">设计坞</a>
                            </div>
                            <div class="bottom_seo_link bottom_seo_link_2" style="display:none;">
                                <a href="">logo</a>
                            </div>
                            <div class="bottom_seo_link bottom_seo_link_3" style="display:none;">
                                <a href="">封面ppt</a>
                            </div>
                            <div class="bottom_seo_link bottom_seo_link_4" style="display:none;">
                                <a href="">双十二优惠券设计</a>
                               
                            </div>
                        </div>
                    </div>
                </ul>
                        </div>
        <div class="footer-bottom-size">
            <div class="w1200">
                <div class="fl footer-function">
                    © 2017 - 2020 快设计 京ICP备170208890号-1 
                </div>
                <div class="fr prevention">
                    网络文化经营许可证 京网文 {2019} 4245-307号 | 广播电视节目制作经营许可证 （京）字第85300号
                </div>
            </div>
        </div>
    </div>
   <!--/Footer Area-->
     <!-- 悬浮层 -->
    <div class="side">
        <ul>
            <li class="sideewm"><i class="bgs1"></i>个人VIP
                <div class="ewBox son tp1"></div>
            </li>
            <li class="sideewm"><i class="bgs2"></i>企业VIP
                <div class="ewBox son tp2"></div>
            </li>
            <li class="sideewm"><i class="bgs3"></i>小程序
                <div class="ewBox son tp3">
                    <p>扫码打开作图小程序</p>
                    <div><img src="images/float_xcx_dtl.png"></div>
                </div>
            </li>
            <li class="sideewm"><i class="bgs4"></i>公众号
                <div class="ewBox son tp3">
                    <p>扫码打开官方公众号</p>
                    <div><img src="images/QRcodeDefault.jpg"></div>
                </div>
            </li>
            <li id="yuyueshow"><i class="bgs5"></i>赚钱</li>
            <li id="yuyueshow"><i class="bgs6"></i>反馈</li>
            <li class="sideetel"><i class="bgs7"></i>客服
                <div class="telBox son">
                    <dd class="bgs1">
                        <span style="color: #333;font-weight: 700;">在线客服</span>
                        工作日：9:00-22:00<br>节假日：10:00-18:00
                        <a class="lianxi" href="">联系客服</a>
                    </dd>
                    <dd class="bgs2">
                        <span style="color: #333;font-weight: 700;">企业定制客服QQ</span>
                        客服：1348341620
                        <a class="lianxi" href="">联系客服</a>
                    </dd>
                </div>
            </li>
            <li id="yuyueshow"><i class="bgs8"></i>设计定制</li>
            <li id="yuyueshow"><i class="bgs9"></i>邀请活动</li>
            <li id="yuyueshow"><i class="bgs10"></i>教程</li>
            <li class="sidetop" onClick="goTop()"><i class="bgs11"></i>返回顶部</li>
        </ul>
    </div>

    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
    <script>
        function goTop() {
            $('html,body').animate({
                scrollTop: 0
            }, 500)
        }
    </script>
   <!-- /悬浮层 -->
    <script src="js/salvattore.min.js"></script>
    <script type="text/javascript">
        //瀑布流
           
        
        $(function(){
         //全部板式鼠标悬浮触发下拉
        $('.nav-plate').hover(function() {
            $('.nav-plate-item').toggle();
        })
        //选项卡切换
        $('.nav-sort li').click(function(){
            indexC = $(this).index();
            $(this).addClass('nav-sprtno').siblings().removeClass('nav-sprtno');
        })
        
    })
    </script>
    <!-- 模态框 -->
    <div class="renzheng">
        <div class="bz-box registration" id="video">
            <div class="reg-content2">
                <span class="iconfont fr icon-guanbi login-box-close" style="z-index: 99999;"></span>
                <video src="https://blz-videos.nosdn.127.net/1/OverWatch/AnimatedShots/Overwatch_AnimatedShot_Soldier76_Hero.mp4" id="videoShow"></video>
                <span class="VideoBtn"><img src="images/bo1.png"></span>
            </div>
        </div>
    </div>
    <!-- /模态框 -->
 <script type="text/javascript">
    $(function() {
        //弹窗
        $('.animate-box').click(function() {
            $('.renzheng').show();
        })
        //关闭
        $('.login-box-close').click(function() {
            $('.renzheng').hide();
        })
        //关闭
        // $('.queren').click(function() {
        //     $('.renzheng').hide();
        // })         
    })

    <!--视频插件调用方法-->
    $(function () {
        //视频
        jsModern.video("#video");
        //播放视频
        $(".VideoBtn").click(function () {
            var video = document.getElementById("videoShow");
            video.play();
            $('.VideoBtn').hide();
        })
        //监听视频的播放状态
        var video = document.getElementById("videoShow");
        video.oncanplay = function () {
            $(".VideoBtn").show();
            //$("#video").attr("poster","");
        }
        //视频播放事件
        video.onplay = function () {
            $("#videoShow").attr("poster", "");
            $(".VideoBtn").hide();
        };
        video.onplaying = function () {
            $(".VideoBtn").hide();
        };

        //视频暂停事件
        video.onpause = function () {
            $(".VideoBtn").show();
        };
        //点击视频周围暂停播放图片出现
        video.onclick = function () {
            if (video.paused) {
                $(".VideoBtn").hide();
                video.play();
            } else {
                $(".VideoBtn").show();
                video.pause();
            }
        };
    })
    </script>
</body>